<template>
    <div>
        <a-descriptions title="基本信息">
            <a-descriptions-item label="编码">
                0001
            </a-descriptions-item>
            <a-descriptions-item label="名称">
                名称
            </a-descriptions-item>
            <a-descriptions-item label="备注">
            </a-descriptions-item>
        </a-descriptions>
        <a-tabs>
            <a-tab-pane key="库位策略" tab="库位策略">
                <a-row :gutter="4">
                    <a-col :md="8">
                        <a-input placeholder="请输入关键词" />
                        <a-directory-tree multiple default-expand-all @select="onSelect" @expand="onExpand">
                            <a-tree-node key="0-0" title="总装车间">
                                <a-tree-node key="0-0-1" title="总装线1#" is-leaf>
                                    <a-tree-node key="0-0-1" title="工位-0001" is-leaf />
                                    <a-tree-node key="0-0-1" title="工位-0002" is-leaf />
                                    <a-tree-node key="0-0-1" title="工位-0003" is-leaf />
                                    <a-tree-node key="0-0-1" title="工位-0004" is-leaf />
                                </a-tree-node>
                                <a-tree-node key="0-0-1" title="车身超市" is-leaf />
                            </a-tree-node>
                            <a-tree-node key="0-1" title="喷涂车间">
                                <a-tree-node key="0-0-1" title="喷涂线1#" is-leaf>
                                    <a-tree-node key="0-0-1" title="工位-0001" is-leaf />
                                    <a-tree-node key="0-0-1" title="工位-0002" is-leaf />
                                    <a-tree-node key="0-0-1" title="工位-0003" is-leaf />
                                    <a-tree-node key="0-0-1" title="工位-0004" is-leaf />
                                </a-tree-node>
                                <a-tree-node key="0-0-1" title="车身超市" is-leaf />
                            </a-tree-node>
                            <a-tree-node key="0-2" title="机械加工车间">
                                <a-tree-node key="0-2-0" title="下料设备群" is-leaf />
                                <a-tree-node key="0-2-0" title="焊接设备群" is-leaf />
                                <a-tree-node key="0-2-0" title="车加工设备群" is-leaf />
                                <a-tree-node key="0-2-0" title="铣加工设备群" is-leaf />
                                <a-tree-node key="0-2-0" title="CNC设备群" is-leaf />
                            </a-tree-node>
                            <a-tree-node key="0-2" title="冲压车间">
                                <a-tree-node key="0-2-0" title="100T冲压设备群" is-leaf />
                                <a-tree-node key="0-2-0" title="200T冲压设备群" is-leaf />
                                <a-tree-node key="0-2-0" title="300T冲压设备群" is-leaf />
                            </a-tree-node>
                        </a-directory-tree>
                    </a-col>
                    <a-col :md="16">
                        <a-form @submit="handleSubmit" :form="form" class="form" layout="inline">
                            <a-alert message="默认为动态货位，启用静态货位后，需要配置货位对应物料" type="warning" />
                            <a-row :gutter="[8]">
                                <a-col :sm="24">
                                    <a-form-item label="启用静态货位">
                                        <a-switch />
                                    </a-form-item>
                                </a-col>

                            </a-row>
                        </a-form>
                        <vxe-toolbar>
                            <template #buttons>
                                <a-space>
                                    <a-button type="primary">添加</a-button>
                                    <a-button>导入</a-button>
                                    <a-button type="danger">批量删除</a-button>
                                </a-space>
                            </template>
                        </vxe-toolbar>
                        <vxe-table ref="xTable1" border stripe height="400"
                            :checkbox-config="{ trigger: 'row', highlight: true, range: true }"
                            :column-config="{ resizable: true }" :row-config="{ isHover: true }" :data="tableData"
                            :custom-config="{ storage: true, checkMethod: checkColumnMethod }">
                            <vxe-column type="checkbox" width="40"></vxe-column>
                            <vxe-column type="seq" width="30"></vxe-column>
                            <vxe-column field="物料" title="物料" sortable>
                                <template #default>
                                    <a-button type="link">物料</a-button>
                                </template>
                            </vxe-column>
                            <vxe-column field="操作" title="操作" fixed="right" width="100">
                                <template #default>
                                    <a-button type="link" danger>删除</a-button>
                                </template>
                            </vxe-column>
                        </vxe-table>
                        <vxe-pager border icon-prev-page="vxe-icon-arrow-left" icon-jump-prev="vxe-icon-arrow-double-left"
                            icon-jump-next="vxe-icon-arrow-double-right" icon-next-page="vxe-icon-arrow-right"
                            icon-jump-more="vxe-icon-ellipsis-h" :loading="loading" :current-page="1" :page-size="20"
                            :total="100" :layouts="['PrevPage', 'JumpNumber', 'NextPage', 'FullJump', 'Sizes', 'Total']"
                            @page-change="handlePageChange">
                        </vxe-pager>
                    </a-col>
                </a-row>
            </a-tab-pane>
            <a-tab-pane key="物料策略" tab="物料策略">
                <a-alert message="没有配置策略的物料，将按照默认策略执行；强烈建议给出明确的策略！！！" type="warning" />
                <vxe-toolbar>
                    <template #buttons>
                        <a-space>
                            <a-button type="primary">添加</a-button>
                            <a-button>导入</a-button>
                            <a-button type="danger">批量删除</a-button>
                        </a-space>
                    </template>
                </vxe-toolbar>
                <vxe-table ref="xTable1" border stripe height="400"
                    :checkbox-config="{ trigger: 'row', highlight: true, range: true }" :column-config="{ resizable: true }"
                    :row-config="{ isHover: true }" :data="tableData"
                    :custom-config="{ storage: true, checkMethod: checkColumnMethod }">
                    <vxe-column type="checkbox" width="40"></vxe-column>
                    <vxe-column type="seq" width="30"></vxe-column>
                    <vxe-column field="物料" title="物料" sortable width="100">
                        <template #default>
                            <a-button type="link">物料</a-button>
                        </template>
                    </vxe-column>
                    <vxe-column field="条码规则" title="条码规则" sortable width="150">标准四段码</vxe-column>
                    <vxe-column field="最小包装单元" title="最小包装单元" sortable width="150"></vxe-column>
                    <vxe-column field="存储单位" title="存储单位" sortable width="150">KG</vxe-column>
                    <vxe-column field="单位换算策略" title="单位换算策略" sortable width="150"></vxe-column>
                    <vxe-column field="安全库存-上限" title="安全库存-上限" sortable width="150"></vxe-column>
                    <vxe-column field="安全库存-下限" title="安全库存-下限" sortable width="150"></vxe-column>
                    <vxe-column field="库龄报警阈值" title="库龄报警阈值" sortable width="150"></vxe-column>
                    <vxe-column field="有效期报警阈值" title="有效期报警阈值" sortable width="150"></vxe-column>
                    <vxe-column field="有效期" title="有效期" sortable width="150"></vxe-column>
                    <vxe-column field="库位推荐策略" title="库位推荐策略" sortable width="150">按经验</vxe-column>
                    <vxe-column field="先进先出策略" title="先进先出策略" sortable width="150">按有效期</vxe-column>
                    <vxe-column field="操作" title="操作" fixed="right" width="100">
                        <template #default>
                            <a-button type="link">编辑</a-button>
                            <a-button type="link">删除</a-button>
                        </template>
                    </vxe-column>
                </vxe-table>
                <vxe-pager border icon-prev-page="vxe-icon-arrow-left" icon-jump-prev="vxe-icon-arrow-double-left"
                    icon-jump-next="vxe-icon-arrow-double-right" icon-next-page="vxe-icon-arrow-right"
                    icon-jump-more="vxe-icon-ellipsis-h" :loading="loading" :current-page="1" :page-size="20" :total="100"
                    :layouts="['PrevPage', 'JumpNumber', 'NextPage', 'FullJump', 'Sizes', 'Total']"
                    @page-change="handlePageChange">
                </vxe-pager>
            </a-tab-pane>

            <a-tab-pane key="作业类型" tab="作业类型">
                <vxe-toolbar>
                    <template #buttons>
                        <a-space>
                            <a-button type="primary">添加</a-button>
                            <a-button>导入</a-button>
                            <a-button type="danger">批量删除</a-button>
                        </a-space>
                    </template>
                </vxe-toolbar>
                <vxe-table ref="xTable1" border stripe height="400"
                    :checkbox-config="{ trigger: 'row', highlight: true, range: true }" :column-config="{ resizable: true }"
                    :row-config="{ isHover: true }" :data="tableData"
                    :custom-config="{ storage: true, checkMethod: checkColumnMethod }">
                    <vxe-column type="checkbox" width="40"></vxe-column>
                    <vxe-column type="seq" width="30"></vxe-column>
                    <vxe-column field="出入类型" title="出入类型" sortable width="100">
                        出库
                    </vxe-column>
                    <vxe-column field="作业类型" title="作业类型" sortable show-overflow>
                        销售出库
                    </vxe-column>
                    <vxe-column field="作业流程" title="作业流程" sortable show-overflow>
                        通知>拣货>报检>复核>出库
                    </vxe-column>
                    <vxe-column field="操作" title="操作" fixed="right" width="150">
                        <template #default>
                            <a-button type="link">编辑</a-button>
                            <a-button type="link" danger>删除</a-button>
                        </template>
                    </vxe-column>
                </vxe-table>
                <vxe-pager border icon-prev-page="vxe-icon-arrow-left" icon-jump-prev="vxe-icon-arrow-double-left"
                    icon-jump-next="vxe-icon-arrow-double-right" icon-next-page="vxe-icon-arrow-right"
                    icon-jump-more="vxe-icon-ellipsis-h" :loading="loading" :current-page="1" :page-size="20" :total="100"
                    :layouts="['PrevPage', 'JumpNumber', 'NextPage', 'FullJump', 'Sizes', 'Total']"
                    @page-change="handlePageChange">
                </vxe-pager>
            </a-tab-pane>

            <a-tab-pane key="人员权限" tab="人员权限">
                <vxe-toolbar>
                    <template #buttons>
                        <a-space>
                            <a-button type="primary">添加</a-button>
                            <a-button>导入</a-button>
                            <a-button type="danger">批量删除</a-button>
                        </a-space>
                    </template>
                </vxe-toolbar>
                <vxe-table ref="xTable1" border stripe height="400"
                    :checkbox-config="{ trigger: 'row', highlight: true, range: true }" :column-config="{ resizable: true }"
                    :row-config="{ isHover: true }" :data="tableData"
                    :custom-config="{ storage: true, checkMethod: checkColumnMethod }">
                    <vxe-column type="checkbox" width="40"></vxe-column>
                    <vxe-column type="seq" width="30"></vxe-column>
                    <vxe-column field="工号" title="工号" sortable width="100">
                        <template #default="{ rowIndex }">U-0000{{ rowIndex + 1 }}</template>
                    </vxe-column>
                    <vxe-column field="姓名" title="姓名" sortable show-overflow>张三</vxe-column>
                    <vxe-column field="操作" title="操作" fixed="right" width="150">
                        <template #default>
                            <a-button type="link">编辑</a-button>
                            <a-button type="link" danger>删除</a-button>
                        </template>
                    </vxe-column>
                </vxe-table>
                <vxe-pager border icon-prev-page="vxe-icon-arrow-left" icon-jump-prev="vxe-icon-arrow-double-left"
                    icon-jump-next="vxe-icon-arrow-double-right" icon-next-page="vxe-icon-arrow-right"
                    icon-jump-more="vxe-icon-ellipsis-h" :loading="loading" :current-page="1" :page-size="20" :total="100"
                    :layouts="['PrevPage', 'JumpNumber', 'NextPage', 'FullJump', 'Sizes', 'Total']"
                    @page-change="handlePageChange">
                </vxe-pager>
            </a-tab-pane>
        </a-tabs>
    </div>
</template>
  
<script>
export default {
    name: 'Table',
    data() {
        return {
            tableData: [{}, {}, {}, {}, {},],
        }
    },
    created() {
    },
    methods: {

    }
}
</script>
  
<style scoped lang="less"></style>